<template>
  <view>
    <view class="search-bar">
      <view class="search-input">
        <input placeholder="输入关键字搜索" v-model="changeValue" />
      </view>
      <view class="search-btn" confirm-type="search" @tap="search">搜索</view>
    </view>
    <uni-list>
      <block v-for="(item, index) in staff" :key="index">
        <uni-list-item
          :thumb="item.avatar"
          thumb-size="lg"
          :title="item.nickName"
          link
          @click="toDetail(item.userName)"
        ></uni-list-item>
      </block>
    </uni-list>
  </view>
</template>

<script>
import { getMyManagerPower } from "../../common/service.js";
export default {
  data() {
    return {
      changeValue: "",
      staff: [],
      loginInfo: {},
    };
  },
  onLoad(e) {
    if (e.loginInfo) {
      this.loginInfo = JSON.parse(e.loginInfo);
    }
  },
  onShow() {
    this.getMyManagerPower();
  },
  methods: {
    search: function () {
      this.getMyManagerPower(this.changeValue);
    },
    getMyManagerPower(query) {
      uni.showLoading({
        title: "加载中",
      });
      getMyManagerPower(
        {
          parentUserId: this.loginInfo.parentUserId,
          powerModule: this.loginInfo.powerModule,
          query: query || "",
        },
        (res) => {
          uni.hideLoading();
          if (res && res.data && res.data.code == 200) {
            if (res.data.data) {
              let list = res.data.data;
              let arr = [];
              if (list.length > 0) {
                for (let i = 0; i < list.length; i++) {
                  arr.push(this.__format(list[i]));
                }
              }
              this.staff = arr;
            }
          } else {
            uni.showToast({
              title: "获取我管理的权限失败",
              duration: 2000,
            });
          }
        },
        (err) => {
          uni.showToast({
            title: "操作失败",
            duration: 2000,
          });
        }
      );
    },
    __format(item) {
      return {
        userName: item.userName,
        avatar: item.avatar,
        nickName: item.nickName,
      };
    },
    toDetail(userName) {
      this.loginInfo.toPowerId = userName;
      uni.navigateTo({
        url:
          "../manage-detail/manage-detail?loginInfo=" +
          JSON.stringify(this.loginInfo),
      });
    },
  },
};
</script>

<style scoped>
.search-bar {
  background-color: #eeeeee;
  display: flex;
  justify-content: space-between;
  margin: 23upx 30upx;
  border-radius: 6upx;
  height: 70upx;
}
.search-input {
  flex: 1;
  line-height: 70upx;
  background: #eeeeee;
  border-radius: 33rpx;
  margin-right: 20rpx;
  padding: 0 24rpx 0 78rpx;
  background-image: url("http://pi.4006002222.com/qyweb2/miniImg/hifmini/yundianadmin/search-icon.png");
  background-size: 40rpx;
  background-position: 16rpx 16rpx;
  background-repeat: no-repeat;
}
.search-input input {
  height: 100%;
  width: 100%;
  font-size: 28rpx;
  font-family: PingFang SC;
  font-weight: 400;
  color: #999999;
  line-height: 70rpx;
}
.search-btn {
  flex: 0 0 130upx;
  text-align: center;
  line-height: 70upx;
  font-size: 30upx;
  font-weight: 400;
  color: #ffffff;
  background: #3875c6;
  border-radius: 0px 6upx 6upx 0px;
}
</style>
